.Theme-Radius {
  &-label {
    margin-bottom: px2rem(10px);
    color: #5c5f66;
    font-size: 12px;
  }
  .cxd-Form-item {
    margin-bottom: 0;
  }
  &-inner {
    display: flex;
  }
  &-item {
    margin-right: px2rem(4px);
    border-radius: 4px;
    overflow: hidden;
    height: px2rem(32px);
    width: px2rem(32px);
    flex-shrink: 0;
    flex-grow: 0;
    display: flex;
    cursor: pointer;
    &-all {
      background: #f7f7f9;
      height: px2rem(32px);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: px2rem(32px);
      &:before {
        content: '';
        height: px2rem(14px);
        width: px2rem(14px);
        display: block;
        border: 2px solid #5c5f66;
        border-radius: 2px;
      }
    }
    &-custom {
      background: #f7f7f9;
      height: px2rem(32px);
      position: relative;
      width: px2rem(32px);
      border-left: 1px solid #e8e9eb;
      &:before {
        content: '';
        height: px2rem(14px);
        width: px2rem(14px);
        display: block;
        border: 2px solid #5c5f66;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        border-radius: 2px;
      }
      &:after {
        content: '＋';
        color: #f7f7f9;
        display: block;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-size: px2rem(30px);
        font-weight: 900;
      }
    }
    &-all--active,
    &-custom--active {
      &:before {
        border-color: #2468f2;
      }
    }
  }
  &-item--custom {
    width: px2rem(64px);
  }
  &-settings {
    flex: 1;
  }

  &-settings-custom {
    display: flex;
    justify-content: space-between;
    margin-top: px2rem(8px);
    .arrow-icon {
      display: none;
    }
    input {
      padding: 0 !important;
    }
    .theme-select {
      padding: 0 px2rem(4px) !important;
    }
    &-item:last-child {
      margin-right: 0;
    }
    &-item {
      flex: 1;
      min-width: 0;
      margin-right: px2rem(4px);
      &-label {
        height: px2rem(10px);
        width: px2rem(10px);
        border: 0 solid #5c5f66;
        margin: px2rem(8px) auto;
        border-radius: 2px;
      }
      &-top-left {
        border-top-width: 2px;
        border-left-width: 2px;
      }
      &-top-right {
        border-top-width: 2px;
        border-right-width: 2px;
      }
      &-bottom-left {
        border-bottom-width: 2px;
        border-left-width: 2px;
      }
      &-bottom-right {
        border-bottom-width: 2px;
        border-right-width: 2px;
      }
    }
  }
}
